import React from 'react';
import MetaTags from 'react-meta-tags';

import { history } from 'umi'
import PC from './PC';
import Mobile from './Mobile';

function isPc() {
    const userAgentInfo = navigator.userAgent;
    const Agents = ['Android', 'iPhone', 'SymbianOS', 'Windows Phone', 'iPad', 'iPod'];
    let flag = true;
    for (let v = 0; v < Agents.length; v += 1) {
        if (userAgentInfo.indexOf(Agents[v]) > 0) {
            flag = false;
            break;
        }
    }
    return flag;
}

const HireConfirm = ({ location }) => {
    const [status, setStatus] = React.useState('');
    const [companyName, setCompanyName] = React.useState('');
    const [offerEffectiveValue, setOfferEffectiveValue] = React.useState(48);
    const [isMobile, setIsMobile] = React.useState(false);
    const { query } = location;
    const { action, employId } = query;
    const isDetailPage = action === 'detail';

    React.useEffect(() => {
        if (!isDetailPage) {
            history.push({
                pathname: '/external/hireConfirm',
                query: {
                    id: employId
                }
            });
        }
    }, []);
    React.useEffect(() => {
        setIsMobile(!isPc());
    }, []);

    const props = {
        offerEffectiveValue,
        setOfferEffectiveValue,
        status,
        setStatus,
        companyName,
        setCompanyName,
        location
    };
    if (!isDetailPage) {
        return <div/>
    }
    if (isMobile) {
        return (
            <>
                <MetaTags>
                    <title>微微科技官网</title>
                    <meta name="keywords" content="微微科技官网" />
                    <meta name="description" content="微微科技官网" />
                    <meta
                        name="viewport"
                        content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"
                    />
                </MetaTags>
                <Mobile {...props} />
            </>
        );
    }

    return <PC {...props} />;
};

export default HireConfirm;
